<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>找回密码</title>
    <link rel="stylesheet" href="css/conmmon.css">
    <link rel="stylesheet" href="css/login.css">
    <script src="js/jquery.min.js"></script>
</head>

<body>
    <div class="login-container">
        <!-- 中间的注册框 -->
        <div class="login-dialog">
            <h3>找回密码</h3>
            <div class="row">
                <span>用户名</span>
                <input type="text" id="username">
            </div>

            <div id="userquestion">
                
            </div>
            
            <div class="row">

            </div>
            <div class="row">
                <button id="submit" onclick="mysub()">提交</button>
            </div>
        </div>
        <script>
            // count 为0就是提交用户名，否则就是提交答案
            var count = 0;
            function mysub(){
                if(count == 0){
                    var username = jQuery("#username");
                    if(username.val()==""){
                        alert("请先输入用户名！");
                        username.focus();// 将鼠标光标移动到此控件上
                        return;
                    }
                    jQuery.ajax({
                        url:"/user/retrieve",
                        type:"POST",
                        data:{"username":username.val()},
                        success:function(result){
                            // 响应结果
                            if(result!=null && result.code==200){
                                // 执行成功
                                var userDiv = "";
                                var userItem = result.data;
                                userDiv += '<div class="row">';
                                userDiv += '<span>问题</span>';
                                userDiv += '<div>' + userItem.question + '</div>';
                                userDiv += '</div>';
                                userDiv += '<div class="row">';
                                userDiv += '<span>答案</span>';
                                userDiv += '<input type="text" id="answer">';
                                userDiv += '</div>';
                                //jQuery("#userquestion").html(userDiv);
                                count = 1;
                                document.getElementById('userquestion').insertAdjacentHTML("afterend",userDiv);
                            }else{
                                alert("用户不存在")
                            }
                        }
                    });
                }else{
                    var username = jQuery("#username");
                    var answer = jQuery("#answer");
                    if(username.val()==""){
                        alert("请先输入用户名！");
                        username.focus();// 将鼠标光标移动到此控件上
                        return;
                    }
                    if(answer.val()==""){
                        alert("请先输入问题答案！");
                        answer.focus();// 将鼠标光标移动到此控件上
                        return;
                    }
                    jQuery.ajax({
                        url:"/user/retrieve2",
                        type:"POST",
                        data:{"username":username.val(),"answer":answer.val()},
                        success:function(result){
                            // 响应结果
                            if(result!=null && result.code==200 && result.data==1){
                                // 执行成功
                                if(confirm("执行成功，密码已被初始化为 123456 ,是否重新登录？")){
                                    location.href = "/login.html";
                                }
                            }else{
                                alert("用户不存在或答案错误")
                            }
                        }
                    });
                }
                
            }
        </script>
            
</body>
</html>